﻿<template>
    <div class="ad-content">
        <div class="ad-main">
            <div class="ad-console-top">
                <div class="ad-console-top-name">访问量</div>
                <div class="ad-console-top-body">
                </div>
                <div class="ad-console-top-end">
                </div>
            </div>
            <div class="ad-console-body">
                <div class="ad-console-toolbar">
                    <el-button type="primary" size="mini" icon="icon-refresh2 el-icon--left" @click="refresh">刷新</el-button>
                    <div style="float:right">
                        <el-date-picker v-model="sd" size="mini" type="daterange" format="yyyy年MM月dd日" value-format="yyyy-MM-dd" align="right" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions" style="width:260px">
                        </el-date-picker>
                        <el-input v-model="searchkey" prefix-icon="el-icon-search" placeholder="姓名/单位" @keyup.enter.native="load()" style="width:150px;" size="mini"></el-input>
                        <el-button type="primary" size="mini" @click="load()" style="padding: 7px 10px;">搜索</el-button>
                    </div>
                </div>
                <el-card class="box-card">
                    <el-table ref="tbl" size="mini" :data="plist" border style="width: 100%" @select="handleSelect">
                        <el-table-column type="index" width="55" label="序号" align="center"></el-table-column>
                        <el-table-column prop="employeeName" width="100" label="姓名" align="center">
                        </el-table-column>
                        <el-table-column prop="empJobLevelName" width="150" label="职业" align="center">
                        </el-table-column>
                        <el-table-column prop="OrganizationName" label="单位/部门" header-align="center">
                        </el-table-column>
                        <el-table-column prop="Role" label="角色" width="150" align="center">
                        </el-table-column>
                        <el-table-column prop="Instime" label="最后访问时间" width="150" align="center">
                        </el-table-column>
                    </el-table>
                    <br />
                    <div style="text-align:center"><el-pagination v-if="count>0" background layout="total, prev, pager, next" :current-page="currentpage" :total="count" @current-change="pagerclick"></el-pagination></div>
                </el-card>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        data() {
            return {
                plist: [],
                sd: [],
                count: 0,
                currentpage: 0,
                pickerOptions: {
                    shortcuts: [{
                        text: '最近一周',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近一个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
                            picker.$emit('pick', [start, end]);
                        }
                    }, {
                        text: '最近三个月',
                        onClick(picker) {
                            const end = new Date();
                            const start = new Date();
                            start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
                            picker.$emit('pick', [start, end]);
                        }
                    }]
                },
                searchkey:''
            }
        },
        mounted() {
            App.Page.init(this);
            this.load();
        },
        methods: {
            load() {
                var param = {
                    start: App.Fn.toStart(this.currentpage),
                    limit: App.pagesize,
                    key: this.searchkey
                };
                if (this.sd.length > 0) {
                    param.sdate = this.sd[0];
                    param.edate = this.sd[1];
                }
                App.Service.post("/plus/Yqd/Department/GetLogList", param).then((res) => {
                    if (res.success) {
                        this.count = res.totalcount;
                        this.plist = res.data;
                    }
                });
            },
            pagerclick(currentpage) {
                this.currentpage = currentpage;
                this.load();
            },
            refresh() {
                this.searchkey = "";
                this.sd = [];
                this.load();
            }
        }
    };
</script>
